<template>
	<view class="content container">
		<u-form :model="form" :rules="rules" ref="uForm" >
			<!-- 修改密码 -->
			<u-form-item class="code" prop="pwd1">
				<u-input type="password" placeholder="输入旧密码" v-model="form.pwd1" clearable style="height:90rpx">
				</u-input>
			</u-form-item>
			<u-form-item class="code mb-60" prop="pwd2">
				<u-input type="password" placeholder="输入新密码" v-model="form.pwd2" clearable style="height:90rpx">
				</u-input>
			</u-form-item>
			<!-- 通栏按钮 -->
			<u-button @click="submit" :custom-style="buttonStyle" shape="circle" hover-class="none">完成</u-button>
		</u-form>
	</view>
</template>

<script>
	import {password} from "@/utils/RegExp.js";
	import { API } from "@/config/myApi.js";
	export default {
		data() {
			return {
				form: {
					pwd1: '',
					pwd2: '',
				},
				rules: {
					pwd1: [{
							required: true,
							message: '请输入旧密码',
							// 可以单个或者同时写两个触发验证方式 
							trigger: ['change', 'blur'],
						},
						// 正则判断为字母或数字
						{
							pattern:password,
							// 正则检验前先将值转为字符串
							transform(value) {
								return String(value);
							},
							message: '密码需要6-20位',
							trigger: ['change', 'blur'],
						}
					],
					pwd2: [{
							required: true,
							message: '请输入新密码',
							// 可以单个或者同时写两个触发验证方式 
							trigger: ['change', 'blur'],
						},{
						required: true,
							min: 5,
							message: '密码需要6-20位',
							trigger: ['change', 'blur']
						}, // 正则判断为字母或数字
						// 校验用户是否已存在
						{
							asyncValidator: (rule, value, callback) => {
								console.log(value, this.form.pwd1)
								if (value == this.form.pwd1) {
										callback(new Error('新密码不能和旧密码一致'));	
								} else {
									callback();
								}
							},
						}
					]
				},
				buttonStyle: {
					width: "100%",
					height: "90rpx",
					fontSize: "32rpx",
					color: "#fff",
					borderRadius: "45rpx",
					backgroundColor: "#F4333C",
				},
			};
		},
		onReady() {
			this.$refs.uForm.setRules(this.rules);
		},
		methods: {
			submit() {
				this.$refs.uForm.validate(valid => {
					if (valid) {
						const pwd1 = this.md5(this.form.pwd1);
						const pwd2 = this.md5(this.form.pwd2);
						let pram = {
							password:pwd1,// 旧密码
							newPassword:pwd2,
						}
						console.log(pram);
						API.modifyPass(pram).then(res =>{
							if(res.code === 200) {
								uni.showToast({
									title:"修改成功，请重新登录",
									icon:"none"
								})
								this.$store.dispatch('A_loginOut')
								uni.navigateTo({
									url:"/pages/passport/login"
								})
							}else{
								uni.showToast({
									title:res.message,
									icon:"none"
								})
							}
							console.log('验证通过',res);
						})
					} else {
						
						console.log('验证失败');
					}
				});
			}
		}
	}
</script>

<style lang="scss" scoped>
	.content {
		height: 100%;
		background-color: #fff;

		.code {
			// padding: 0;
			border-bottom: 1rpx solid #E3E3E3;
			/deep/.u-input__input {
				min-height: 100rpx !important;
			}
			/deep/.u-form-item__message{
				position: absolute;
				bottom:-34rpx;
				left: -90rpx;
			}
			// 验证码
			.get-code {
				font-size: 26rpx;
				color: #F4333C;
				position: absolute;
				right: 0;
				top: 18rpx;
			}
		}
	}

	
</style>
